<template>
	<zkView ref="zkView" v-slot:uContainer>
		<view class="container">
			<view class="contentBg">
				<view class="content">
					<view class="card">
						<view class="userInfo">
							<view class="avatar">
								<image mode="aspectFill" :src="userInfo.avatarUrl||'/static/mine/avatar.png'"></image>
							</view>
							<view class="midd">
								<text class="userName">{{ userInfo.nickname || '昵称' }}</text>
								<text v-if="userInfo.role===9" class="userLabel">我是店长</text>
								<text v-else-if="userInfo.role===2" class="userLabel">已开通会员</text>
								<text v-else class="userLabel">尚未开通会员</text>
							</view>
							<view class="right">
								<text v-if="userInfo.role===2" class="txtGold">VIP</text>
								<text v-else>VIP</text>
							</view>
						</view>
						<view class="cardInfo">
							<text v-if="userInfo.role===2">正享折扣优惠等6项特权</text>
							<text v-else>开通会员·享折扣优惠等6项特权</text>
						</view>
					</view>
					<view class="privilege">
						<view class="title">
							<text>会员·享受多重优惠特权</text>
						</view>
						<view class="itemArr">
							<view class="item">
								<uni-icons type="wallet-filled" size="68rpx"></uni-icons>
								<text>专属9折</text>
							</view>
							<view class="item">
								<uni-icons type="flag-filled" size="68rpx"></uni-icons>
								<text>全国包邮</text>
							</view>
							<view class="item">
								<uni-icons type="undo-filled" size="68rpx"></uni-icons>
								<text>急速退款</text>
							</view>
							<view class="item">
								<uni-icons type="chatbubble-filled" size="68rpx"></uni-icons>
								<text>专属客服</text>
							</view>
							<view class="item">
								<uni-icons type="hand-up-filled" size="68rpx"></uni-icons>
								<text>积分兑礼</text>
							</view>
							<view class="item">
								<uni-icons type="calendar-filled" size="68rpx"></uni-icons>
								<text>生日福利</text>
							</view>
						</view>
						<view class="privilegeBtn" v-if="userInfo.role===1" @click="joinVip">
							<text>9.9元/终身会员 立即开通</text>
						</view>
					</view>

					<view class="coupon">
						<view class="couponTitle">
							<text>专属礼券</text>
						</view>
						<view class="couponArr">
							<view class="couponItem" v-for="item in couponList" :key="item._id">
								<view class="top">
									<view class="topLeft">
										<rich-text :nodes="formatPrice(item.discount,2)" />
									</view>
									<view class="topRight">
										<text v-if="item.type===1">{{item.usage_limit}}折优惠</text>
										<text v-if="item.type===2">满{{formatPrice(item.usage_limit)}}立减</text>
										<text>全场通用</text>
									</view>
								</view>
								<view class="bottom" v-if="userInfo.role===1" @click="joinVip">
									<text>开通会员立即领取</text>
								</view>
								<view class="bottom" v-if="userInfo.role!==1&&!item.is_received" @click="toReceived(item)">
									<text>立即领取</text>
								</view>
								<view class="corner" v-if="userInfo.role!==1">
									<text v-if="item.is_received">已领取</text>
									<text v-else>待领取</text>
								</view>
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
	</zkView>
</template>

<script>
	import indexJs from './index.js';
	import mixins from '@/common/mixins.js';
	export default {
		components: {},
		mixins: [mixins],
		...indexJs
	};
</script>

<style lang="scss" scoped>
	@import './index.scss';
</style>